.grid {
	display: grid;
}

.flex {
	display: flex;
}

.flex-col {
	flex-direction: column;
}

.grow-1 {
	flex-grow: 1;
}

.justify-center {
	justify-content: center;
}

.justify-between {
	justify-content: space-between;
}

.items-center {
	align-items: center;
}

.text-center {
	text-align: center;
}

.text-red-400 {
	color: oklch(70.4% 0.191 22.216);
}

.text-green-600 {
	color: oklch(62.7% 0.194 149.214);
}

.text-blue-500 {
	color: oklch(62.3% 0.214 259.815);
}

.text-error {
	color: #dd524d;
}

.text-sm {
	font-size: 12px;
}

.text-base {
	font-size: 14px;
}

.text-lg {
	font-size: 16px;
}

.font-bold {
	font-weight: bold;
}

.h-screen {
	height: calc(100vh - 100px);
}

.lh-lg {
	line-height: 16px;
}

.bg-primary {
	background-color: #007aff;
}

.text-h1 {
	font-size: 32px;
}

.grid-col-1 {
	grid-template-columns: repeat(1, minmax(0, 1fr));
}

.gap-1 {
	gap: 4px;
}

.m-1 {
	margin: 4px;
}

.mx-1 {
	margin-left: 4px;
	margin-right: 4px;
}

.my-1 {
	margin-top: 4px;
	margin-bottom: 4px;
}

.ms-1 {
	margin-left: 4px;
}

.me-1 {
	margin-right: 4px;
}

.mt-1 {
	margin-top: 4px;
}

.mb-1 {
	margin-bottom: 4px;
}

.p-1 {
	padding: 4px;
}

.px-1 {
	padding-left: 4px;
	padding-right: 4px;
}

.py-1 {
	padding-top: 4px;
	padding-bottom: 4px;
}

.ps-1 {
	padding-left: 4px;
}

.pe-1 {
	padding-right: 4px;
}

.pt-1 {
	padding-top: 4px;
}

.pb-1 {
	padding-bottom: 4px;
}

.text-h2 {
	font-size: 28px;
}

.grid-col-2 {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.gap-2 {
	gap: 8px;
}

.m-2 {
	margin: 8px;
}

.mx-2 {
	margin-left: 8px;
	margin-right: 8px;
}

.my-2 {
	margin-top: 8px;
	margin-bottom: 8px;
}

.ms-2 {
	margin-left: 8px;
}

.me-2 {
	margin-right: 8px;
}

.mt-2 {
	margin-top: 8px;
}

.mb-2 {
	margin-bottom: 8px;
}

.p-2 {
	padding: 8px;
}

.px-2 {
	padding-left: 8px;
	padding-right: 8px;
}

.py-2 {
	padding-top: 8px;
	padding-bottom: 8px;
}

.ps-2 {
	padding-left: 8px;
}

.pe-2 {
	padding-right: 8px;
}

.pt-2 {
	padding-top: 8px;
}

.pb-2 {
	padding-bottom: 8px;
}

.text-h3 {
	font-size: 24px;
}

.grid-col-3 {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.gap-3 {
	gap: 12px;
}

.m-3 {
	margin: 12px;
}

.mx-3 {
	margin-left: 12px;
	margin-right: 12px;
}

.my-3 {
	margin-top: 12px;
	margin-bottom: 12px;
}

.ms-3 {
	margin-left: 12px;
}

.me-3 {
	margin-right: 12px;
}

.mt-3 {
	margin-top: 12px;
}

.mb-3 {
	margin-bottom: 12px;
}

.p-3 {
	padding: 12px;
}

.px-3 {
	padding-left: 12px;
	padding-right: 12px;
}

.py-3 {
	padding-top: 12px;
	padding-bottom: 12px;
}

.ps-3 {
	padding-left: 12px;
}

.pe-3 {
	padding-right: 12px;
}

.pt-3 {
	padding-top: 12px;
}

.pb-3 {
	padding-bottom: 12px;
}

.text-h4 {
	font-size: 20px;
}

.grid-col-4 {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.gap-4 {
	gap: 16px;
}

.m-4 {
	margin: 16px;
}

.mx-4 {
	margin-left: 16px;
	margin-right: 16px;
}

.my-4 {
	margin-top: 16px;
	margin-bottom: 16px;
}

.ms-4 {
	margin-left: 16px;
}

.me-4 {
	margin-right: 16px;
}

.mt-4 {
	margin-top: 16px;
}

.mb-4 {
	margin-bottom: 16px;
}

.p-4 {
	padding: 16px;
}

.px-4 {
	padding-left: 16px;
	padding-right: 16px;
}

.py-4 {
	padding-top: 16px;
	padding-bottom: 16px;
}

.ps-4 {
	padding-left: 16px;
}

.pe-4 {
	padding-right: 16px;
}

.pt-4 {
	padding-top: 16px;
}

.pb-4 {
	padding-bottom: 16px;
}

.text-h5 {
	font-size: 16px;
}

.grid-col-5 {
	grid-template-columns: repeat(5, minmax(0, 1fr));
}

.gap-5 {
	gap: 20px;
}

.m-5 {
	margin: 20px;
}

.mx-5 {
	margin-left: 20px;
	margin-right: 20px;
}

.my-5 {
	margin-top: 20px;
	margin-bottom: 20px;
}

.ms-5 {
	margin-left: 20px;
}

.me-5 {
	margin-right: 20px;
}

.mt-5 {
	margin-top: 20px;
}

.mb-5 {
	margin-bottom: 20px;
}

.p-5 {
	padding: 20px;
}

.px-5 {
	padding-left: 20px;
	padding-right: 20px;
}

.py-5 {
	padding-top: 20px;
	padding-bottom: 20px;
}

.ps-5 {
	padding-left: 20px;
}

.pe-5 {
	padding-right: 20px;
}

.pt-5 {
	padding-top: 20px;
}

.pb-5 {
	padding-bottom: 20px;
}

.text-h6 {
	font-size: 12px;
}

.grid-col-6 {
	grid-template-columns: repeat(6, minmax(0, 1fr));
}

.gap-6 {
	gap: 24px;
}

.m-6 {
	margin: 24px;
}

.mx-6 {
	margin-left: 24px;
	margin-right: 24px;
}

.my-6 {
	margin-top: 24px;
	margin-bottom: 24px;
}

.ms-6 {
	margin-left: 24px;
}

.me-6 {
	margin-right: 24px;
}

.mt-6 {
	margin-top: 24px;
}

.mb-6 {
	margin-bottom: 24px;
}

.p-6 {
	padding: 24px;
}

.px-6 {
	padding-left: 24px;
	padding-right: 24px;
}

.py-6 {
	padding-top: 24px;
	padding-bottom: 24px;
}

.ps-6 {
	padding-left: 24px;
}

.pe-6 {
	padding-right: 24px;
}

.pt-6 {
	padding-top: 24px;
}

.pb-6 {
	padding-bottom: 24px;
}

.text-h7 {
	font-size: 8px;
}

.grid-col-7 {
	grid-template-columns: repeat(7, minmax(0, 1fr));
}

.gap-7 {
	gap: 28px;
}

.m-7 {
	margin: 28px;
}

.mx-7 {
	margin-left: 28px;
	margin-right: 28px;
}

.my-7 {
	margin-top: 28px;
	margin-bottom: 28px;
}

.ms-7 {
	margin-left: 28px;
}

.me-7 {
	margin-right: 28px;
}

.mt-7 {
	margin-top: 28px;
}

.mb-7 {
	margin-bottom: 28px;
}

.p-7 {
	padding: 28px;
}

.px-7 {
	padding-left: 28px;
	padding-right: 28px;
}

.py-7 {
	padding-top: 28px;
	padding-bottom: 28px;
}

.ps-7 {
	padding-left: 28px;
}

.pe-7 {
	padding-right: 28px;
}

.pt-7 {
	padding-top: 28px;
}

.pb-7 {
	padding-bottom: 28px;
}

.text-h8 {
	font-size: 4px;
}

.grid-col-8 {
	grid-template-columns: repeat(8, minmax(0, 1fr));
}

.gap-8 {
	gap: 32px;
}

.m-8 {
	margin: 32px;
}

.mx-8 {
	margin-left: 32px;
	margin-right: 32px;
}

.my-8 {
	margin-top: 32px;
	margin-bottom: 32px;
}

.ms-8 {
	margin-left: 32px;
}

.me-8 {
	margin-right: 32px;
}

.mt-8 {
	margin-top: 32px;
}

.mb-8 {
	margin-bottom: 32px;
}

.p-8 {
	padding: 32px;
}

.px-8 {
	padding-left: 32px;
	padding-right: 32px;
}

.py-8 {
	padding-top: 32px;
	padding-bottom: 32px;
}

.ps-8 {
	padding-left: 32px;
}

.pe-8 {
	padding-right: 32px;
}

.pt-8 {
	padding-top: 32px;
}

.pb-8 {
	padding-bottom: 32px;
}